window.addEventListener('load',function(){
    //配置
    var config = {
        vx: 4,	//小球x轴速度,正为右，负为左
        vy: 4,	//小球y轴速度
        height: 2,	//小球高宽，其实为正方形，所以不宜太大
        width: 2,
        count: 200,		//点个数
        color: "#C1C1C1", 	//点颜色
        stroke: "#EDEDED", 		//线条颜色
        dist: 6000, 	//点吸附距离
        e_dist: 20000, 	//鼠标吸附加速距离
        max_conn: 10 	//点到点最大连接数
    }

    //调用
    CanvasParticle(config);
    
    // 次数渲染
   let apiDetails=$("#apiDetails")
   let moneyA=$("#right-box4-money2")   
   let moneyB=$("#right-box4-money3")
   
let  apiTimeData=[
    {"times": 4000, "price": 1200, "unitPrice": "0.3000"},
    {"times": 8000, "price": 2000,"unitPrice": "0.2500" },
    {"times": 40000, "price": 8000, "unitPrice": "0.2000" }
]
apiTimeData.forEach(function(v,i){
    //   创建标签
    let liDom=document.createElement("li")
    liDom.className="default-li"
    if (i===0) {
        liDom.className="default-li  active"
    }else{
        liDom.className="default-li"
    }
    console.log(v.times); 
    liDom.innerHTML=v.times+"次"
    // 添加节点
    apiDetails.appendChild(liDom)
})
// li点击事件
 let  detailsLi=$All("#apiDetails .default-li")
 detailsLi.forEach(function(v,i){
      v.addEventListener("click",function(){
        detailsLi.forEach(function(vv){
            vv.classList.remove("active")
        })
           this.classList.add("active")
      })
      moneyA.innerHTML=apiTimeData[i].times
moneyB.innerHTML=apiTimeData[i].unitPrice
 })

}) 
tab(".content-heardr1","content-heardr-file",".content-next1","block")



